<template>
  <div>
    <Form ref="formList" :model="formList" inline :label-width="80">
      <Row>
        <Col span="12">
        <FormItem label="设备名称" class="wid">
          <Input v-model="formList.equip_name"></Input>
        </FormItem>
        </Col>
        <Col span="12">
        <FormItem label="规格型号" class="wid">
          <Input v-model="formList.equip_model"></Input>
        </FormItem>
        </Col>
      </Row>
      <Row>
        <Col span="12">
        <FormItem label="设备编码" class="wid">
          <Input v-model="formList.equip_coding"></Input>
        </FormItem>
        </Col>
        <Col span="12">
        <FormItem label="设备类型" class="wid">
          <Input v-model="formList.equip_type"></Input>
        </FormItem>
        </Col>
      </Row>
      <Row>
        <Col span="12">
        <FormItem label="设备标识" class="wid">
          <Input v-model="formList.equip_signboard"></Input>
        </FormItem>
        </Col>
        <Col span="12">
        <FormItem label="功率" class="wid">
          <Input v-model="formList.equip_power"></Input>
        </FormItem>
        </Col>
      </Row>
      <Row>
        <Col span="12">
        <FormItem label="生产厂商" class="wid">
          <Input v-model="formList.equip_firm"></Input>
        </FormItem>
        </Col>
        <Col span="12">
        <FormItem label="供应商名称" class="wid">
          <Input v-model="formList.equip_supplier"></Input>
        </FormItem>
        </Col>
      </Row>
      <Row>
        <Col span="12">
        <FormItem label="供应商电话" class="wid">
          <Input v-model="formList.equip_supplier_tel"></Input>
        </FormItem>
        </Col>
        <Col span="12">
        </Col>
      </Row>

    </Form>
    <div class="modalFooter">
      <Button type="error" class="button" @click="cancel" :loading="loading">取消</Button>
      <template v-if="this.switch">
        <Button type="success" class="button" @click="onAdd" :loading="loading" v-if="!formList.id">添加</Button>
        <Button type="primary" class="button" @click="onEdit" :loading="loading" v-else>修改</Button>
      </template>
    </div>
  </div>
</template>
<script>
import { deviceAdd, deviceUp } from '@/api/device'
export default {
  name: 'DeviceInfo',
  components: {

  },
  props: {
    formList: {
      type: Object,
      default: () => {
        return {}
      }
    },
    switch: {
      type: Boolean,
      default: () => {
        return false
      }
    }
  },
  data () {
    return {
      loading: false
    }
  },
  created () {

  },
  mounted () {

  },
  methods: {
    init () {

    },
    cancel () {
      this.$emit('cancel')
    },
    onAdd () {
      this.loading = true
      deviceAdd({
        ...this.formList
      }).then(res => {
        let data = res.data.data
        if (data) {
          this.init()
          this.$Message.success({
            content: '添加成功！'
          })
          this.loading = false
          this.$emit('cancel')
          this.$emit('init')
        } else {
          this.$Message.error({
            content: '添加失败\n' + res.data.errmsg
          })
          this.loading = false
        }
      })
    },
    onEdit () {
      this.loading = true
      deviceUp({
        ...this.formList
      }).then(res => {
        let data = res.data.data
        if (data) {
          this.init()
          this.$Message.success({
            content: '修改成功！'
          })
          this.loading = false
          this.$emit('cancel')
          this.$emit('init')
        } else {
          this.$Message.error({
            content: '修改失败\n' + res.data.errmsg
          })
          this.loading = false
        }
      })
    }
  },
  computed: {

  }
}
</script>
<style lang='less' scoped>
.modalFooter {
  text-align: right;
  .button {
    margin-left: 5px;
  }
}
.wid {
  width: 100%;
}
</style>
